<template>
  <div class="qf-container">
    <div class="qf-d1">
      <div
        :class="activeIndex === index ? 'qf-item qf-item-active' : 'qf-item'"
        v-for="(item,index) in qfArr"
        :key="index"
        @click="handlerActive(index, item)"
      >
        <span><i
            style="color: red;"
            v-if="item.vf && isEdit"
          >* </i>{{item.label}}</span>
        <span>{{ item.num ? `(${item.num})`: '(0)' }}</span>
      </div>
    </div>
    <div class="gf-d2">
      <qf-common
        ref="qc"
        :cname="cname"
        :isEdit="isEdit"
        :vf="vf"
        :subForm="subForm"
        :label="label"
        :add="add"
        @changeForm="changeForm"
      ></qf-common>
    </div>
  </div>
</template>

<script>
import vaildFormData from "./vaildFormData";
export default {
  name: "Qualification",
  components: {
    "qf-common": () => import("./common"),
  },
  props: {
    list: {
      type: Array,
      default: () => [],
    },
    isEdit: {
      type: Boolean,
      default: true,
    },
    add: {
      type: Boolean,
      default: true,
    },
    dictNum: {
      type: Number,
      default: 129,
    },
  },
  computed: {
    menuData() {
      return {
        dictNum: this.dictNum,
        list: this.list,
      };
    },
  },
  watch: {
    menuData: {
      handler(val) {
        const dicts = this.getDict[val.dictNum];
        const dtArr = [];
        dicts.forEach((ele) => {
          let obj = {
            label: ele.dictValue,
            value: ele.dictCode,
            num: 0,
            name: this.userComponents(ele.dictValue),
          };
          dtArr.push(obj);
        });
        this.qfArr = dtArr;
        if (JSON.stringify(val.list) != "[]") {
          const intersect = [];
          const dataList = [];
          const list = val.list;
          for (let i = 0; i < list.length; i++) {
            let x = this.qfArr.find((e) => {
              return e.value === list[i].code;
            });
            x.vf = list[i].vf;
            if (Array.isArray(list[i].fileList)) {
              x.num = list[i].fileList.length;
            }
            intersect.push(x);
            let [...fl] = list[i].fileList;
            let obj = {
              fileType: x.value,
              fileTypeName: x.label,
              fileList: fl,
            };
            dataList.push(obj);
          }
          this.qfArr = intersect;
          this.dataList = dataList;
          this.handlerActive(this.activeIndex);
        }
      },
      immediate: true,
    },
  },
  data() {
    return {
      activeIndex: 0,
      cname: "",
      currentEle: {},
      label: "",
      subForm: {},
      vf: false,
      dataList: [],
      qfArr: [],
      qfNum: 0,
    };
  },
  methods: {
    // 具体显示什么组件
    userComponents(name) {
      let com = "";
      switch (name) {
        case "营业执照":
          com = "qf-business";
          break;
        case "药品经营许可证":
        case "互联网药品信息服务资格证":
        case "互联网药品信息服务资格证书":
          com = "qf-business-licence";
          break;
        case "第二类医疗器械经营许可证":
        case "第三类医疗器械经营许可证":
          com = "qf-second-drug-apparatus-business-licence";
          break;
        case "食品经营许可证":
          com = "qf-food-business-licence";
          break;
        default:
          com = "qf-general";
          break;
      }
      return com;
    },
    // 切换资质的方法
    handlerActive(val) {
      this.activeIndex = val;
      this.currentEle = this.qfArr[this.activeIndex];
      this.cname = this.currentEle.name;
      this.vf = this.currentEle.vf;
      this.label = this.currentEle.label;
      let n = this.dataList.findIndex((ele) => {
        return ele.fileType === this.currentEle.value;
      });
      if (n != -1 && this.dataList[n].fileList[0]) {
        this.subForm = this.dataList[n].fileList[0];
      } else {
        this.subForm = {};
      }
    },
    // 外部调用的方法
    submit() {
      return new Promise((resolve, reject) => {
        this.$refs.qc
          .submit()
          .then((res) => {
            let n = this.dataList.findIndex((ele) => {
              return ele.fileType === this.currentEle.value;
            });
            let obj = {
              fileType: this.currentEle.value,
              fileTypeName: this.currentEle.label,
              fileList: [res],
            };
            if (n != -1) {
              this.dataList[n] = obj;
            } else {
              this.dataList.push(obj);
            }
            let { b, msg } = this.vfFun(this.dataList);
            if (b) {
              resolve(this.dataList);
            } else {
              this.$message.error(msg);
              reject({
                code: 110,
                data: this.dataList,
                msg: msg,
              });
            }
          })
          .catch((error) => {
            this.$message.error(error.msg);
            reject({ code: 110, data: this.dataList, msg: error.msg });
          });
      });
    },
    // 验证整个数据是否完善的方法
    vfFun(data) {
      let b = true;
      let msg = "";
      let bfor = true;
      for (let i = 0; i < this.qfArr.length; i++) {
        if (!bfor) {
          break;
        }
        let code = this.qfArr[i].value;
        let row = data.find((ele) => {
          return ele.fileType === code;
        });
        if (
          this.qfArr[i].vf &&
          this.isEdit &&
          row &&
          row.fileList.length === 0
        ) {
          b = false;
          msg = `${this.qfArr[i].label}的数据缺失，请检查是否完善`;
          break;
        } else if (
          (this.isEdit &&
            row &&
            row.fileList.length > 0 &&
            row.fileList[0].fileUrl) ||
          (this.isEdit && this.qfArr[i].vf && row && row.fileList.length > 0)
        ) {
          let o1 = vaildFormData[this.qfArr[i].name];
          let o2 = row.fileList[0];
          let obj = Object.structure({}, o1, o2);

          for (let key in obj) {
            if (obj[key] === "" || obj[key] == null || obj[key] == undefined) {
              b = false;
              msg = `${this.qfArr[i].label}的数据缺失，请检查是否完善`;
              bfor = false;
              break;
            }
          }
        }
      }
      return { b: b, msg: msg };
    },
    // 子组件改变form表单的数据
    changeForm(val) {
      let arr = [...this.dataList];
      let n = arr.findIndex((ele) => {
        return ele.fileType === this.currentEle.value;
      });
      if (n != -1) {
        arr[n].fileList[0] = { ...val };
      } else {
        let ele = { ...val };
        let obj = {
          fileType: this.currentEle.value,
          fileTypeName: this.currentEle.label,
          fileList: [ele],
        };
        arr.push(obj);
      }
      this.dataList = arr;
    },
  },
};
</script>

<style lang="less" scoped>
.qf-container {
  display: flex;
  justify-content: flex-start;
}
.qf-d1 {
  padding-right: 29px;
  border-right: 1px solid #dcdfe6;
}
.gf-d2 {
  padding-left: 29px;
}
.qf-item {
  width: 238px;
  height: 32px;
  background: #f5f7fa;
  border: 1px solid #e4e7ed;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 400;
  color: #606266;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 10px;
  cursor: pointer;
}
.qf-item-active {
  background: rgba(24, 144, 255, 0.1);
  border: 1px solid #1890ff;
  color: #1890ff;
}
</style>
